<template>
  <!--农事事项状态-->
  <div class="tastStatus" :class="code"><i v-if="showDot">·</i>{{ name || tranfCode(code) }}</div>
</template>
<script setup>
import { ref } from 'vue'
const props = defineProps({
  code: '',
  name: '',
  showDot: {
    type: Boolean,
    default: true
  }
})
const tranfCode = (code) => {
  switch (code) {
    case 'DQR':
      return '待确认'
    case 'DCL':
      return '待处理'
    case 'YCL':
      return '已处理'
    case 'YYQ':
      return '已延期'
    case 'YQX':
      return '已取消'
    case 'YWC':
      return '已完成'
    case 'ZXZ':
        return '执行中'
    default:
      return ''
  }
}
</script>

<style lang="scss" scoped>
.tastStatus{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    line-height: 30px;
    font-weight: normal;
    i{
        font-style: normal;
        font-size: 30px;
        font-weight: bold;
        margin: -5px 5px 0 0;
    }
    &.DQR,&.DCL{
        color: #FF9C00;
    }
    &.YCL,&.ZXZ{
        color: #3D94FF;
    }
    &.YYQ{
        color: #FF7449;
    }
    &.YQX{
        color: #7E7E7E;
    }
    &.YWC{
        color: #0BB174;
    }
    &.WKS{
        color: #FF9D02;
    }
}
</style>
